Skip to main content

Slider

Description​

<jp-slider> is a form component with <input type="range"> functionality.


Attributes​

NameRequiredTypeDescription
valuenumbersetter and getter
name✓stringname of the form control
idstringunique identifier
disabledbooleandetermines if slider is disabled
maxnumbermaximal slider value
minnumberminimal slider value
stepnumbersize of increment/decrement when sliding
discretebooleanwhether slider is smooth or in ticks
(when false step is any)


Slots​

This component does not have any slots.



Methods​

  • getValue
    • returns form field value


Events​

  • value
    • triggers when slider value changes


Demo​

Live Editor
// import '@jaspero/web-components/slider.wc.js';
// import '@jaspero/web-components/slider.css';

<jp-slider></jp-slider>
Result
Loading...